html {
  height: 100%;
  margin: 0;
  padding: 0;
}

body {
  margin: 0;
  padding: 0;
  background: black;
}

#topContainer {
  visibility: hidden;
}

.largetxt {
  position: absolute;
  top: 25%;
  left: 20%;
  margin: auto;
  text-align: left;
  font-size: 5em;
  color: white;
  z-index: 4;
}

#pic {
  position: fixed;
  right: 10%;
  bottom: 2.3%;
  max-width: 22%;
}

@media (max-width: 767px) and (orientation:portrait) {
  #pic {
    right: 25%;
    width: auto;
    max-width: 35%;
    max-height: 37%;
  }

  .largetxt {
    top: 32%;
    left: 15.5%;
    font-size: 2.5em;
  }
}

@media (max-width: 767px) and (orientation:landscape) {
  #pic {
    right: 15%;
    width: auto;
    max-width: 35%;
    max-height: 37%;
  }

  .largetxt {
    top: 22%;
    left: 14.5%;
    font-size: 3em;
  }

  #topleft {
    top: 35%;
    left: 3.7em;
    visibility: visible;
    font-size: 1em;
    font-weight: 300;
  }

  #top {
    visibility: hidden;
  }
}

@media (min-width: 768px) and (max-width: 1024px) and (orientation:portrait) {
  #pic {
    right: 15%;
    width: auto;
    max-width: 35%;
    max-height: 35%;
  }

  .largetxt {
    top: 32%;
    left: 14.5%;
    font-size: 5.2em;
  }
}

@media (min-width: 768px) and (max-width: 1024px) and (orientation:landscape) {
  #pic {
    right: 12%;
    width: auto;
    max-width: 35%;
    max-height: 35%;
  }

  .largetxt {
    top: 22%;
    left: 14.5%;
    font-size: 4.5em;
  }
}
